<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <base th:href="@{/}"><!-- 不用base就使用th:src="@{/js/jquery.min.js} -->
    <meta charset="UTF-8">
    <title>商品页面</title>
    <link rel="stylesheet" href="css/bootstrap.min.css"/>
    <script src="js/jquery.min.js"></script>
    <script type="text/javascript" th:inline="javascript">
        function focus() {
            $.ajax(
                {
                    //请求路径，要注意的是url和th:inline="javascript"
                    url: [[@{/cart/focus
                }
        ]],
            //请求类型
            type : "post",
                contentType
        :
            "application/json",
                //data表示发送的数据
                data
        :
            JSON.stringify({
                id: $("#gid").val()
            }),
                //成功响应的结果
                success
        :

            function (obj) {//obj响应数据
                if (obj == "no") {
                    alert("您已收藏该商品！");
                } else if (obj == "ok") {
                    alert("成功收藏该商品");
                } else {
                    alert("您没有登录，请登录！");
                }
            }

        ,
            error : function () {
                alert("处理异常！");
            }
        }
        )
            ;
        }

        function putCart() {
            if (!(/(^[1-9]\d*$)/.test($("#buyNumber").val()))) {
                alert("购买量请输入正整数!");
                $("#buyNumber").focus();
                return;
            }
            if (parseInt($("#buyNumber").val()) > parseInt($("#gstore").text())) {
                alert("购买量超出库存!");
                $("#buyNumber").focus();
                return;
            }
            //获取路径
            var pathName = window.document.location.pathname;
            //截取，得到项目名称
            var projectName = pathName.substring(0, pathName.substr(1).indexOf('/') + 1);
            window.location.href = projectName + "/cart/putCart?id=" + $("#gid").val() + "&buyNumber=" + $("#buyNumber").val();
        }
    </script>
</head>
<body>
    <!-- 加载header.html -->
    <div th:include="user/header"></div>
    <div class="container">
        <div class="row">
            <div class="col-xs-6 col-md-3">
                <img
                        th:src="${goods.gpicture}"
                        style="height: 220px; width: 280px; display: block;">
            </div>
            <div class="col-xs-6 col-md-3">
                <p>商品名：<span th:text="${goods.gname}"></span></p>
                <p>
                    商品折扣价：<span style="color: red;">&yen;
						<span th:text="${goods.grprice}"></span>
					</span>
                </p>
                <p>
                    商品原价：
                    <span class="text-dark" style="text-decoration: line-through;"> &yen;
						<span th:text="${goods.goprice}"></span>
					</span>
                </p>
                <p>
                    商品类型：<span th:text="${goods.typename}"></span>
                </p>
                <p>
                    库存：<span id="gstore" th:text="${goods.gstore}"></span>
                </p>
                <p>
                    <input type="text" size="12" class="form-control" placeholder="请输入购买量" id="buyNumber"
                           name="buyNumber"/>
                    <input type="hidden" name="gid" id="gid" th:value="${goods.id}"/>
                </p>
                <p>
                    <a href="javascript:focus()" class="btn btn-primary"
                       style="font-size: 10px;">加入收藏</a>
                    <a href="javascript:putCart()" class="btn btn-success"
                       style="font-size: 10px;">加入购物车</a>
                </p>
            </div>
        </div>
    </div>
</body>
</html>